﻿{% extends "earth_engine/base.html" %}
{% load tethys_gizmos static %}

{% load i18n %}
{% get_current_language as LANGUAGE_CODE %}
<!-- Current language: {{ LANGUAGE_CODE }} -->
{% block content_dependent_styles %}
{{ block.super }}

<link rel="stylesheet" href="{% static 'earth_engine/css/main.css' %}" />
<link rel="stylesheet" href="{% static 'earth_engine/css/map.css' %}" />
<link rel="stylesheet" href="{% static 'earth_engine/css/loader.css' %}" />
<link rel="stylesheet" href="{% static 'earth_engine/css/plot.css' %}" />



{% endblock %}
<!-- Overwrite the title so it translates-->
{% block app_title %}{% trans 'AppTitle' %}{% endblock %}


{% block import_gizmos %}
  {% import_gizmo_dependency plotly_view %}
  {% import_gizmo_dependency select_input %}
{% endblock %}

{% block app_navigation_items %}
<div id="app-navigation-items">
    <h3 class="title" id="eeapp-selection-header">{% trans 'SelectionHeader' %} <a class="help" data-toggle="tooltip" href="#" data-placement="right" title="{% trans 'SelectHelp' %}">&#9432;</a></h3>

    {% gizmo platform_select %}
    {% gizmo sensor_select %}
    {% gizmo product_select %}
    {% gizmo start_date %}
    {% gizmo end_date %}
    {% gizmo reducer_select %}
    {% gizmo load_button %}
    {% gizmo clear_imagery_button %}
    <br>
    <br>

    <!-- Layer Selection -->
    {% gizmo select_layer %}
    <label for="test-input">{% trans 'FileInputHeader' %}</label>
    <a class="help" href="#" data-toggle="tooltip" data-placement="right" title="{% trans 'UploadHelp' %}">&#9432;</a>
    <input type="file" id="file-input" name="file-input" accept=".zip,.kml,.geojson,.json">
    <button type="button" id="submit-input-button">{% trans 'AddSelectedFile' %}</button>
    <br>
    <br>
    {% gizmo plot_button %}
    <a class="help" href="#" data-toggle="tooltip" data-placement="right" title="{% trans 'PlotHelp' %}">&#9432;</a>
    <br>

    <br>
    <input type="checkbox" name="labelfeatures" value="label">
    <label id="eeapp-label-check" for="labelcheck">{% trans 'LabelCheck' %}</label>
    <br>
    <br>

    <button type="button" id="eeapp-about-label">{% trans 'AboutButton' %}</button>
    



</div>
{% endblock %}

{% block app_content %}
  {% gizmo map_view %}
  <div>
      <p><img src="{% static 'earth_engine/images/shield_richmond.png' %}" alt="URichmond Shield" style="width:48px;height:57px" vspace="6" hspace="19">Created by Valerie Galati (University of Richmond ABSAT, 2021)</p>
  </div>
{% endblock %}

{# Use the after_app_content block for modals #}
{% block after_app_content %}
<!-- Plot Modal -->
<div class="modal fade" id="plot-modal" tabindex="-1" role="dialog" aria-labelledby="plot-modal-label">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h5 class="modal-title" id="plot-modal-label">{% trans 'AOIModalHeader' %}</h5>
            </div>
            <div class="modal-body">
                <div id="plot-container"></div>
            </div>
        </div>
    </div>
</div>
<!-- End Plot Modal -->
<!-- About Modal (make this into a separate url if it gets so long that you have to scroll) -->
<div class="modal fade" id="about-modal" tabindex="-1" role="dialog" aria-labelledby="about-modal-label">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h5 class="modal-title" id="about-label">{% trans 'AboutButton' %}</h5>
            </div>
            <div class="modal-body">
                <div id="about-text">
                    <p>{% trans 'AboutMessage1' %} <a href="http://www.stephaniespera.com/nasa-servir.html" target="_blank" rel="noopener noreferrer">{% trans 'URABSAT' %}</a> {% trans 'AboutMessage2' %} <a href="https://www.servirglobal.net/ServiceCatalogue/details/6033b1fd6ad008160c43c135" target="_blank" rel="noopener noreferrer">{% trans 'SERVIRProject' %}</a>.</p>
                    <h6>{% trans 'RSSourceHeader' %}</h6>
                    <ul style="list-style-type:circle;">
                        <li><a href="https://developers.google.com/earth-engine/datasets/catalog/MODIS_006_MOD16A2" target="_blank" rel="noopener noreferrer">MODIS TERRA {% trans 'NetEvap8Day500m' %}</a></li>
                        <li><a href="https://developers.google.com/earth-engine/datasets/catalog/MODIS_006_MOD13A1" target="_blank" rel="noopener noreferrer">MODIS TERRA {% trans 'NDVI16Day500m' %}</a></li>
                        <li>Landsat 8 {% trans '8DayNDVI' %} [{% trans 'CalculatedFrom' %} <a href="https://developers.google.com/earth-engine/datasets/catalog/LANDSAT_LC08_C01_T1_RT_TOA" target="_blank" rel="noopener noreferrer">Landsat 8 TOA</a>, <a href="https://code.earthengine.google.com/1f6dace8e5892ad00523e0841cbda11e" target="_blank" rel="noopener noreferrer">{% trans 'ExampleCalc' %}</a>]</li>
                        <li>Landsat 8 {% trans '32DayNDVI' %} [{% trans 'CalculatedFrom' %} <a href="https://developers.google.com/earth-engine/datasets/catalog/LANDSAT_LC08_C01_T1_RT_TOA" target="_blank" rel="noopener noreferrer">Landsat 8 TOA</a>, <a href="https://code.earthengine.google.com/1f6dace8e5892ad00523e0841cbda11e" target="_blank" rel="noopener noreferrer">{% trans 'ExampleCalc' %}</a>]</li>
                    </ul>

                    <h6>{% trans 'AboutLayerHeader' %}</h6>
                    <ul style="list-style-type:circle;">
                        <li>{% trans 'Watersheds' %} (Pfafstetter lv. 9): Lehner, B., Grill G. (2013): Global river hydrography and network routing: baseline data and new approaches to study the world’s large river systems. Hydrological Processes, 27(15): 2171–2186. ({% trans 'Downloaded' %} 2020) [<a href="https://www.hydrosheds.org/images/inpages/HydroBASINS_TechDoc_v1c.pdf" target="_blank" rel="noopener noreferrer">HydroBASINS v1.c {% trans 'Documentation' %}</a>] [<a href="https://www.hydrosheds.org/downloads" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>]</li>
                        <li>{% trans 'SettlProj' %}: <a href="https://www.gov.br/incra/pt-br" target="_blank" rel="noopener noreferrer">INCRA</a> ({% trans 'Downloaded' %} 2020)</li>
                        <li>{% trans 'AcreMunic' %}: <a href="https://www.ibge.gov.br/" target="_blank" rel="noopener noreferrer">IBGE</a> ({% trans 'Downloaded' %} 2020)</li>
                        <li>{% trans 'UcaDist' %}: <a href="https://www.inei.gob.pe/" target="_blank" rel="noopener noreferrer">INEI</a> ({% trans 'Downloaded' %} 2020)</li>
                        <li>{% trans 'UcaAcre' %}: <a href="https://www.ibge.gov.br/" target="_blank" rel="noopener noreferrer">IBGE</a> ({% trans 'Downloaded' %} 2020), <a href="https://www.inei.gob.pe/" target="_blank" rel="noopener noreferrer">INEI</a> ({% trans 'Downloaded' %} 2020)</li>
                        <li>{% trans 'TITitled' %}, {% trans 'TIUntitled' %}, {% trans 'TIReserves' %}, {% trans 'TIProposedReserves' %}: <a href="https://www.amazoniasocioambiental.org/" target="_blank" rel="noopener noreferrer">RAISG, 2020 - Territorios Indigenas</a> ({% trans 'Downloaded' %} 2021) [<a href="https://www.amazoniasocioambiental.org/es/mapas/#download" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>]</li>
                        <li>{% trans 'ANPs' %}: <a href="https://www.amazoniasocioambiental.org/" target="_blank" rel="noopener noreferrer">RAISG , 2020 - Área Naturales Protegidas Departamentales</a> ({% trans 'Downloaded' %} 2021) [<a href="https://www.amazoniasocioambiental.org/es/mapas/#download" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>], <a href="https://www.amazoniasocioambiental.org/" target="_blank" rel="noopener noreferrer">RAISG, 2020 - Áreas Naturales Protegidas Nacionales</a> ({% trans 'Downloaded' %} 2021) [<a href="https://www.amazoniasocioambiental.org/es/mapas/#download" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>], <a href="https://www.gob.pe/sernanp" target="_blank" rel="noopener noreferrer">SERNANP</a> ({% trans 'Downloaded' %} 2020) [<a href="http://geo.sernanp.gob.pe/visorsernanp/" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>]</li>
                        <li>{% trans 'ProposedConserv' %}: <a href="https://www.gob.pe/regionucayali" target="_blank" rel="noopener noreferrer">DIRECCIÓN DE GESTIÓN FORESTAL Y FAUNA SILVESTRE UCAYALI</a> ({% trans 'Downloaded' %} 2020) </li>
                        <li>{% trans 'ConcessionsLogging' %}, {% trans 'ConcessionsConservation' %}, {% trans 'ConcessionsReforestation' %}, {% trans 'ConcessionsEcotourism' %}: <a href="https://www.gob.pe/serfor" target="_blank" rel="noopener noreferrer">SERFOR</a> ({% trans 'Downloaded' %} 2020) [<a href="https://geo.serfor.gob.pe/visor/" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>]</li>
                        <li>{% trans 'PetroleumExt' %}, {% trans 'PetroleumProc' %}: <a href="https://www.amazoniasocioambiental.org/" target="_blank" rel="noopener noreferrer">RAISG, 2020 - Lotes Petroleros</a> ({% trans 'Downloaded' %} 2021) [<a href="https://www.amazoniasocioambiental.org/es/mapas/#download" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>]</li>
                        <li>{% trans 'Mining' %}: <a href="https://www.amazoniasocioambiental.org/" target="_blank" rel="noopener noreferrer">RAISG, 2020 - Zonas Mineras</a> ({% trans 'Downloaded' %} 2021) [<a href="https://www.amazoniasocioambiental.org/es/mapas/#download" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>]</li>
                        <li>{% trans 'IllegalMining' %}: <a href="https://www.amazoniasocioambiental.org/" target="_blank" rel="noopener noreferrer">RAISG, Mineria Ilegal 2020</a> ({% trans 'Downloaded' %} 2021) [<a href="https://www.amazoniasocioambiental.org/es/mapas/#download" target="_blank" rel="noopener noreferrer">{% trans 'Download' %}</a>]</li>
                    </ul>

                    <img src="{% static 'earth_engine/images/shield_richmond.png' %}" alt="URichmond Shield" style="width:75px;height:88px" vspace="25" hspace="25" ><img src="{% static 'earth_engine/images/servir_amazonia.png' %}" alt="SERVIR Amazonia Logo" style="width:93px;height:88px" vspace="25" hspace="25"><img src="{% static 'earth_engine/images/nasa_logo.png' %}" alt="NASA Logo" style="width:90.279px;height:88px" vspace="25" hspace="25"><img src="{% static 'earth_engine/images/ABSATenglish_tote.PNG' %}" alt="ABSAT Logo" style="width:88px;height:88px" vspace="25" hspace="25">

                    <p>{% trans 'FundingMessage' %}.</p>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- End About Modal -->

<div id="ee-products" data-ee-products="{{ ee_products|jsonify }}"></div>
<div id="shapefile-path" data-shapefile-path="{{ shapefile_path }}"></div>
<div id="loader">
    <img src="{% static 'earth_engine/images/map-loader.gif' %}">
</div>
{% endblock %}

{% block scripts %}
{{ block.super }}
<script>
    var languageCode = "{{ LANGUAGE_CODE }}"
    if (languageCode.includes('en')) { // remap so that the language codes match the dictionary (by generalizing locale)
        languageCode = 'en';
    } else if (languageCode.includes('es')) {
        languageCode = 'es';
    } else if (languageCode.includes('pt')) {
        languageCode = 'pt';
    } else {
        languageCode = 'es'; // set default as Spanish
    };</script>

<!-- Plotly localization -->
<script src="{% static 'earth_engine/js/plotly_i18n/plotly-locale-es-pe.js' %}"></script><!-- missing a lot, go to just es? -->
<script src="{% static 'earth_engine/js/plotly_i18n/plotly-locale-es.js' %}"></script>
<script src="{% static 'earth_engine/js/plotly_i18n/plotly-locale-pt-br.js' %}"></script>
<script>Plotly.setPlotConfig({ locale: "{{ LANGUAGE_CODE }}" })</script>
<script src="{% static 'earth_engine/js/shp2geojson.js/lib/jszip.js' %}"></script>
<script src="{% static 'earth_engine/js/shp2geojson.js/lib/jszip-utils.js' %}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.6.1/proj4.js"></script>
<script src="{% static 'earth_engine/js/shp2geojson.js/preprocess.js' %}"></script>
<script src="{% static 'earth_engine/js/shp2geojson.js/preview.js' %}"></script>

<script src="{% static 'earth_engine/js/gee_datasets.js' %}" type="text/javascript"></script>
{% endblock %}
